<template>
  <div class="nav">
    <div class="title">
      <div>{{ title }}</div>
      <div v-show="tit2" class="icon">|</div>
      <div v-show="tit2">{{ tit2 }}</div>
      <div v-show="tit" class="icon">|</div>
      <div v-show="tit">{{ tit }}</div>
    </div>
    <div class="divs">
      <el-input
        v-model="input2"
        placeholder="搜索"
        prefix-icon="el-icon-search"
      />
    </div>
  </div>
</template>

<script>
export default {
  props: ["title", "tit", "tit2"],
  data() {
    return {
      input2: "",
    };
  },

  mounted() {},

  methods: {},
};
</script>

<style lang="scss" scoped>
.nav {
  display: flex;
  justify-content: space-between;
  line-height: 68px;
  padding-top: 20px;
  padding-right: 50px;
  .title {
    font-size: 26px;
    display: flex;
    .icon {
      margin: 0 35px;
      line-height: 62px;
    }
  }
  .divs {
    float: left;
    margin-left: 35px;
    ::v-deep .el-input__inner {
      height: 68px;
      width: 500px;
      border-radius: 20px !important;
      padding-left: 80px;
    }
    ::v-deep .el-input__prefix {
      left: 45px;
    }
    ::v-deep .el-input__icon {
      font-size: 28px;
      color: #b6c4ff;
    }
  }
}
</style>
